<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>猪猪八戒餐厅</title>
    <link rel="stylesheet" href="./css/index.css">
</head>
<body>
    <div class="wrap">
        <h2 class="title">猪猪八戒餐厅</h2>
        <!-- 头部餐厅栏 -->
        <div class="header">

            <ul class="header_wrap">
                <li class="left">
                    <span id="weekend">W1</span>
                    <span id="day">D1</span></li>
                <li class="right">
                    <span id="all_momey">100</span>
                </li>
            </ul>
        </div>
        <!-- 厨师栏 -->
        <div class="cook" id="cook">
            <div class="chef">
                <div class="chef-icon">
                    <img src="./img/chef.png">
                </div>
            </div>
            <div class="chef" id="chef_1">
                <div class="chef-icon">
                    <img src="./img/chef.png">
                </div>
                <div class="fireCooker" style="display:none;">
                    X
                </div>
            </div>
            <div class="chef" id="add-chef">
                <div class="add-chef-icon" id="add-chef-icon">
                    <img src="./img/add.png">
                </div>
            </div>
        </div>
        <!-- 就餐栏 -->
        <div class="table">
            <div class="table-firstRow">
                <div class="table-firstRow-left" id="table-firstRow-left">
                    <div></div>
                </div>
                <div class="table-firstRow-right" id="table-firstRow-right">
                    <div></div>
                </div>
            </div>
            <div class="table-secondRow">
                <div class="table-secondRow-left" id="table-secondRow-left">
                    <div></div>
                </div>
                <div class="table-secondRow-right" id="table-secondRow-right">
                    <div></div>
                </div>
            </div>
        </div>
        <!-- 菜单栏 -->
        <div class="menus" id="menus">
            <div class="image">
                <div class="image_content">
                    <img src="./img/customer2.png" alt="" id="cus_img">
      
                </div>
                <p class="image_p" id="image_p">qing正在点菜，已点18员的菜</p>


            </div>
            <div class="form">
                <form id="menu_form">
                    <h3>凉菜（二选一，可不点）</h3>
                    <div class="menu_item">
                        <div><input type="checkbox" value="22" name="menu" /><span>凉拌SAN</span></div>
                        <div>···························<span>￥22</span></div>
                    </div>
                    <div class="menu_item">
                        <div><input type="checkbox" value="44" name="menu" /><span>冷切DOM</span></div>
                        <div>···························<span>￥44</span></div>
                    </div>
                    <h3>主菜（五选一，必点）</h3>
                    <div class="menu_item">
                        <div><input type="checkbox" value="62" name="menu" /><span>UL抄LI</span></div>
                        <div>···························<span>￥62</span></div>
                    </div>
                    <div class="menu_item">
                        <div><input type="checkbox" value="45" name="menu" /><span>红烧HEAD</span></div>
                        <div>···························<span>￥45</span></div>
                    </div>
                    <div class="menu_item">
                        <div><input type="checkbox" value="34" name="menu" /><span>酥炸Table</span></div>
                        <div>···························<span>￥34</span></div>
                    </div>
                    <div class="menu_item">
                        <div><input type="checkbox" value="16" name="menu" /><span>炙烤CSS</span></div>
                        <div>···························<span>￥16</span></div>
                    </div>
                    <div class="menu_item">
                        <div><input type="checkbox" value="22" name="menu" /><span>清蒸DIV</span></div>
                        <div>···························<span>￥22</span></div>
                    </div>
                    <h3>饮品（二选一，可不点）</h3>
                    <div class="menu_item">
                        <div><input type="checkbox" value="25" name="menu" /><span>鲜榨flex</span></div>
                        <div>···························<span>￥25</span></div>
                    </div>
                    <div class="menu_item">
                        <div><input type="checkbox" value="16" name="menu" /><span>小程序奶茶</span></div>
                        <div>···························<span>￥16</span></div>
                    </div>
                </form>
            </div>
            <div class="select">
                <div class="sumbit" id="order">点好了，快点上菜</div>
                <duv class="cancel" id="quit">不吃了</duv>
            </div>
        </div>
        <!-- 页面开始栏 -->
        <div class="open" id="open">
            <div class="message">
                <h4 class="open_title">猪猪八戒餐厅开业啦</h4>
                <p class="open_content">猪猪八戒开业即将开业，请认真经营你的餐厅吧，经营餐厅需要做好下面的几件事情！加油</p>
                <p class="task"><span>招聘厨师</span><span>迎接客人</span><span>烹饪美食</span></p>
                <div class="btn" id="start">开始经营吧</div>
            </div>

        </div>
        <!-- 顾客正在等待栏 -->
        <div class="wait-box" id="wait-box">
    
        </div>
         <!--招聘厨师窗口-->
    <div class="welcome" id="addChef" style="display: none">
        <div class="message">
            <h1 class="advertise">招聘新厨师</h1>
            <p class="p1">
                招聘一名新厨师可以帮你更快地为顾客烹饪菜肴，<br> 增加餐厅收入。你最多可以拥有六名厨师。<br> 但每个厨师每周需要你支付工资 ￥100，<br> 请问你确认新招聘一名厨师吗？
                <br>
            </p>
            <div class="bar">
                <div id="yes-btn">是的，确认招聘</div>
                <div id="no-btn">先不了</div>
            </div>
        </div>
    </div>
    <!--解雇厨师窗口-->
    <div class="welcome02"  id="fire" style="display: none">
        <div class="message">
            <h1 class="fire">解雇厨师</h1>
            <p class="p1">
                解雇当前闲置的厨师可以帮你节省成本。<br> 解雇时会按照厨师本周已经工作的日子结算工资，
                <br> 并会赔偿一周工资作为解约金。
                <br> 解雇当前厨师结算工资及解约金需要付出 ￥140<br>
            </p>
            <div class="bar">
                <div id="sure-fire-btn">是的，确认解雇</div>
                <div id="not-fire-btn">先不了</div>
            </div>
        </div>
    </div>
    <!-- 一般内容展示栏 -->
    <div class="center_alert" id="center_alert">
        <p id="center_alert_p">餐厅目前有空位，赶紧点击等位客人头像让客人入座点餐吧</p>
    </div>
    </div>
</body>

</html>
<script src="./js/base.js"></script>
<script src="./js/index.js"></script>
<script src="./js/Menu.js"> </script>
<script src="./js/tools.js"></script>
<script src="./js/customer.js"></script>
<script src="./js/table.js"></script>
<script src="./js/user.js"></script>
<script src="./js/chef.js"></script>
